import React, { useState, useEffect, useContext } from 'react';
import { Button, Modal, Form, Input, Switch, Space, message } from 'antd';
import getSelectTime from '../../../../utils/date'
import { updateReason } from '../../../../api/OrderApi'
import createContext from '../../../../utils/createContext'
import { stringify } from 'querystring';

interface DataType {
    key: React.Key;
    appliId: number;
    reasonDescription: string;
    // sort:number;
    startUse: boolean;
    insertTime: string
}

interface PropsType {
    isEditModalOpen: boolean;
    close(): void;
    // record:DataType
    clickRow: DataType | null;
}

function OrderReasonDel(props: PropsType) {
    const [form] = Form.useForm();
    // console.log('propsclick', props.clickRow);
    const context = useContext<any>(createContext)
    //  
    // setIsOpen(props.clickRow?props.clickRow.isOpen:'')

    // 确定编辑
    const handleOk = () => {
        // setIsModalOpen(false);
        props.close()
        // console.log('当前编辑时间', getTime());
    };

    //   设置表单初始值
    useEffect(() => {
        form.setFieldsValue({
            desc: props.clickRow ? props.clickRow.reasonDescription : '',
            sort: props.clickRow ? props.clickRow.appliId : '',
            isOpen: props.clickRow ? props.clickRow.startUse : '',
        })
    })

    const cancleHandle = () => {
        // setIsModalOpen(false);
        props.close()
    };

    // /开关切换
    const onSwitchChange = (checked: boolean) => {
        // setIsOpen(!isOpen)
        console.log('checked', checked);
    };

    // 确定编辑
    const onFinish = (values: any) => {
        props.close()
        // 发请求
        updateReason({
            appliId: props.clickRow?.appliId,
            // insertTime: getSelectTime(),
            reasonDescription: values.desc,
            startUse: values.isOpen == true ? 1 : 0
        }).then(res => {
            console.log('修改成功', res);
            context.getAll()
            // 关闭添加弹框
            // 提示
            message.success('编辑成功')
        }).catch(err => {
            console.log('err9999', err);

        })
    };

    return (
        <>
            <Modal title="编辑退换货原因" open={props.isEditModalOpen} footer={null} forceRender>
                <Form form={form}
                    name="normal_login"
                    className="login-form"
                onFinish={onFinish}
                >
                    <Form.Item
                        label='原因描述'
                        name="desc"
                        rules={[{ required: true, message: '请输入原因描述' }]}
                    >

                        <Input placeholder="原因描述" />
                    </Form.Item>
                    <Form.Item
                        name='isOpen'
                        label='是否启用'
                        rules={[{ required: true, message: 'xxx' }]}
                        valuePropName="checked"
                    >
                        <Switch defaultChecked={props.clickRow ? props.clickRow.startUse : undefined} onChange={onSwitchChange}></Switch>
                    </Form.Item>
                    <Form.Item shouldUpdate>
                        {() => (
                            <Space wrap>
                                <Button
                                    type="primary"
                                    htmlType="submit"
                                >
                                    确定
                                </Button>
                                <Button htmlType="button" className='orderlist_reset' onClick={cancleHandle}>
                                    取消
                                </Button>
                            </Space>

                        )}
                    </Form.Item>
                </Form>
            </Modal>
        </>
    );
};

export default OrderReasonDel;